<style src="./index.scss" lang="scss" scoped rel="stylesheet/scss"></style>
<template src="./index.html"></template>
<script>
    export default {
        components: {
        ImageBox: async () =>
            Vue.extend(await Vue.prototype.$vFN.Components.Base.ImageBox()),
    },
        props: {
             // 使用者window实例 必定义
            appWindow: {
                type: Object,
                default: null,
            },
            tuwenList: {
                type: Array,
                default: [],
            },
            // 缩略图key名
            albumUrlKey: {
                type: String,
                default: "coverUrl",
            },
            // 售价key名
            priceKey: {
                type: String,
                default: "salePrice",
            },
            // 库存key名
            sortKey: {
                type: String,
                default: "sort",
            },
            // 名称key名
            nameKey: {
                type: String,
                default: "name",
            },
            // 名称key名
            idKey: {
                type: String,
                default: "id",
            },
            // 已选id
            selectIds: {
                type: Array,
                default: [],
            },
            // 最大上传数量
            count: {
                type: Number,
                default: -1,
            },

        },

        data() {
            return {
                tuwens: [],
                selectList: {},

                showVisible: false,
                showUrl: false,

            };
        },
        computed: {

        },
        methods: {



            show(item) {
                this.showVisible = true;
                this.showUrl = item.albumUrl;
            },
            emit(item, type) {
                this.$emit(type, item);
            },
            getObj() {
                let _obj = []
                let _ids = []
                let _url = []
                this.tuwens.forEach(item => {
                    if (this.isSelect(item)) {
                        _obj.push(item)
                        _ids.push(item.id)
                        _url.push(item.albumUrl)
                    }
                })
                return {
                    obj: _obj,
                    ids: _ids,
                    url: _url,
                }
            },
            isKey() {
                return this.idKey;
            },
            isSelect(item_) {
                return !!this.selectList["key" + item_[this.isKey()]]
            },
            select(item_) {

                console.error(item_,this.selectList)
                let _arr = [];
                if (this.isSelect(item_)) {
                    this.$delete(this.selectList, "key" + item_[this.isKey()])
                }
                // 如果只能选一个则切换已选项目
                else if (this.count == 1) {
                    this.selectList = {};
                    this.selectList["key" + item_[this.isKey()]] = true
                }
                 else {
                    if (this.count >= 0) {
                        // 判断曾经选择的数量是否超出最大数量 
                        if (this.count <= this.selectIds.length) {
                            this.$vFN.Tools.messageError(
                                "最多选择" + this.count + "张！"
                            );
                            return;
                        }
                    }
                    if (this.mode == "wx") {
                        if (item_.isWechat == 0) {
                            this.$vFN.Tools.messageError(
                                "需将此素材同步至微信后使用",
                            );
                            this.emit(item_, 'syncWx')
                            return
                        }
                    }
                    this.selectList["key" + item_[this.isKey()]] = true

                }
                
                for (let i in this.selectList) {
                    _arr.push(i.substr(3));
                }

                this.$emit('update:selectIds', _arr);
            },
            toIds() {
                let _list = {}
                this.selectIds.forEach(item => {
                    _list["key" + item] = true;
                })
                this.selectList = _list
            },
        },
        watch: {
            tuwenList: {
                handler(newVal, oldVal) {

                    this.$set(this, "tuwens", newVal)

                },
                immediate: true,
                deep: true
            },
            selectIds: {
                handler(newVal, oldVal) {
                    this.toIds()
                },
                immediate: true,
                deep: true
            }
        },
        mounted() {},
        beforeCreate() {},
    };
</script>